<html>
<head>
<link rel="shortcut icon" href="http://www.dirtpros.com/images/favicon.ico">
<link rel="stylesheet" type="text/css" href="assets/css/style.css" />
<link href="assets/css/bootstrap.css" rel="stylesheet">
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
<link href="assets/css/docs.css" rel="stylesheet">
<link href="assets/css/prettyPhoto.css" rel="stylesheet" type="text/css" />
<link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet">
<title>Login</title>
</head>
<body>
<div id="wrapper" style="width:100%; text-align:center">
<img id="logo" src="assets/img/logo.jpg" alt="Logo" width = "300" height = "200" align="middle">
<h3 id = "title">Data Collection and Management System</h3>
</div>

<div id="box">
  <form name="formname" method="post">
    <table>
        <tr>
          <td align="right"><label id="text">Username: </label></td>
          <td align="left">
			  <div class="input-prepend">
				<span class="add-on"><i class="icon-user"></i></span>
				<input type="text" id="tbox" name="j_username" placeholder="Username">
			  </div>
		  </td>
        </tr>
        <tr>
          <td align="right"><label id="text">Password: </label></td>
			<td align="left">
				<div class="input-prepend">
					<span class="add-on"><i class="icon-pencil"></i></span>
					<input type="password" id="tbox" name="j_password" placeholder="Password">
				</div>
			</td>
        </tr>
        <!--<tr>
          <td align="right"><button type="button" class="btn btn-success" onclick = "check()">Log In</button></td>
          <td align="left"><button type="reset" class="btn btn-success">Reset</button></td>
        </tr>-->
    </table>
		<button type="button" class="btn btn-success" onclick = "check()">&nbsp;Log In&nbsp;</button>
        <button type="reset" class="btn btn-success">&nbsp;Reset&nbsp;</button>
  </form>
</div>
 
<div id="myDiv"></div>

<script language="javascript">

function check()
{
  var username = document.forms["formname"]["j_username"].value;
  var password = document.forms["formname"]["j_password"].value;

  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange=function()
  {
    if (xmlhttp.readyState==4)
    {
       jsonObj = JSON.parse(xmlhttp.responseText);
       //alert(jsonObj.Verified);
	   if(jsonObj.Verified){
	       window.location="index.html";
	   }
    }
  }
  xmlhttp.open("GET", "http://dirtprosdatabase.appspot.com/login?username="+username+"&password=" +password+"&t="+Math.random(), true);
  xmlhttp.send(null);
 
}
</script>

</body>
</html>
